import Vue from "vue";
import Vuex from "vuex";
import allRoutes from '../router/allRoutes'
import dynamicRoutes from '../router/dynamicRoutes'
import recursionRoutes from '../utils/recursionRoutes'
import * as api from '../api/index'
import router from "../router";

Vue.use(Vuex);
// 因为vuex本质上是一个js文件，所以一刷新储存的信息就会没有了，所以要将用户信息从本地存储获取
let userInfo = localStorage.getItem("qf-userInfo") || "{}"
let preChargeOrder = localStorage.getItem('qf-currentChangeProduct') || "[]"

export default new Vuex.Store({
  state: {
    userInfo: JSON.parse(userInfo),
    sideMenu: [], //用户侧边栏
    isCollapse: false,//定义侧边栏的展开和收起
    breadCrumb: [],//存储面包屑数据
    dialogTitle: '增加学员信息',//控制dialog的标题
    dialogVisible: false,//控制dialog的显示和隐藏
    stuTableData: [], //学员表格的数据
    loading: true, //表格加载动画
    currentRow: {},//点击编辑时的数据回显
    stuTotalPage: 0,//学员信息总页数
    stuPageSize: 6,//每页展示的条数
    vipOrderList: [],//vip订单列表
    preChargeOrder: JSON.parse(preChargeOrder), //当前交易订单
    order_id: '' //存储提交订单的id
  },
  mutations: {
    SET_ORDER_ID(state, payload) { //设置order_id
      state.order_id = payload
    },
    SET_PRE_ORDER(state, payload) { //修改预支付订单信息
      state.preChargeOrder = [payload]
      //为避免刷新页面导致数据丢失，我们要将数据存到本地
      localStorage.setItem('qf-currentChangeProduct', JSON.stringify([payload]))
    },
    SET_VIP_ORDER(state, payload) { //修改vip订单的数据
      state.vipOrderList = payload
    },
    SET_CURRENT_ROW(state, payload) { //修改表格数据回显
      state.currentRow = { ...payload } //结构payload
    },
    SHOW_LOADING(state) { //显示表格加载动画
      state.loading = true
    },
    HIDE_LOADING(state) { //隐藏表格加载动画
      state.loading = false
    },
    SET_STU_DATA(state, payload) { //控制学员表格的数据
      state.stuTableData = payload.data
      // 提交学员信息后，要让表格加载动画关闭
      this.loading = false
      state.stuTotalPage = payload.total //从学员信息中获取总得页数
    },
    SHOW_DIALOG(state) { //控制dialog的显示
      state.dialogVisible = true
    },
    HIDE_DIALOG(state) { //控制dialog的隐藏
      state.dialogVisible = false
    },
    CHANGE_DIALOG_TITLE(state, payload) { //控制dialog的标题信息
      state.dialogTitle = payload
    },
    SET_BREADCRUMB(state, payload) { //处理面包屑的数据
      state.breadCrumb = payload
    },
    SIDE_MENU_COLLAPSE(state) { //控制侧边栏的展开收起
      state.isCollapse = !state.isCollapse
    },
    SET_USER_INFO(state, payload) { //设置用户信息
      state.userInfo = payload;
    },
    SET_SIDE_MENU(state, payload) { //设置侧边栏菜单
      //设置dynamicRoutes=>讲用户路由添加到当前数组中的path="/"的对象的children属性中
      //添加完成之后,还需要将整个dynamicRoutes通过addRoutes的方式添加到系统路由routes中
      let target = dynamicRoutes.find(item => item.path === '/')
      target.children = [...payload, ...target.children]
      // 将dynamicRoutes动态的添加到路由中
      // console.log(dynamicRoutes);
      router.addRoutes(dynamicRoutes)
      //要排除的路由
      let excludeRouter = ['preOrder', 'payMent']
      target.children = target.children.filter(item => !excludeRouter.includes(item.path))
      state.sideMenu = target.children

    }
  },
  actions: {
    //发起异步请求，
    FETCH_MENU_LIST({ commit }) {
      return api.getMenuList()
        .then(res => {
          // console.log(res);
          let menuList = res.data.menuList
          // 递归，匹配出用户路由
          let userMenu = recursionRoutes(allRoutes, menuList)
          commit("SET_SIDE_MENU", userMenu)
        })
    },
    //获取学员信息的请求    
    GET_STU_INFO(context, payload = {}) {
      context.commit('SHOW_LOADING') //打开表格加载动画
      let { page = 1, count = 5, classes = '' } = payload //解构传递的参数
      api.getStuInfo(page, count, classes)
        .then(res => {
          // console.log(res);
          context.commit('SET_STU_DATA', res.data)

        })
    },
    //获取VIP订单的信息
    GET_VIP_ORDER(context, payload) {
      let order_id = payload || ""
      api.getOrderInfo(order_id)
        .then(res => {
          // console.log(123333);
          console.log(res);
          if (res.data.data) {
            context.commit('SET_VIP_ORDER', res.data.data)
          } else {
            this.$message.error('获取订单失败')
          }
        })
    }
  },
  modules: {},
});
